page {
  background: #f4f4f4;
}

.brand-info {
  position: relative;
  height: 278rpx;
  overflow: hidden;
  .info-box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text {
      font-size: 37rpx;
      color: #fff;
    }
    .line {
      margin: 0 auto;
      margin-top: 16rpx;
      display: block;
      height: 2rpx;
      width: 145rpx;
      background: #fff;
    }
  }
}

.sort {
  display: flex;
  background: #fff;
  height: 78rpx;
  line-height: 78rpx;
  text-align: center;
  .item {
    flex: 1;
    font-size: 30rpx;
    text {
      color: #333;
    }
  }
  .active {
    text {
      color: #b4282d;
    }
  }
  .item.by-price {
    background: url(//yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/no-3127092a69.png) 155rpx center no-repeat;
    background-size: 15rpx 21rpx;
  }

  .item.by-price.active.asc {
    background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/up-636b92c0a5.png) 155rpx center no-repeat;
    background-size: 15rpx 21rpx;
  }

  .item.by-price.active.desc {
    background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/down-95e035f3e5.png) 155rpx center no-repeat;
    background-size: 15rpx 21rpx;
  }
}

.cate-item {
  border-top: 1rpx solid #f4f4f4;
  margin-top: 20rpx;
  .content {
    .item {
      display: inline-block;
      width: 50%;
      background: #fff;
      text-align: center;
      border-bottom: 1rpx solid #f4f4f4;
      image {
        display: block;
        margin: 0 auto;
        width: 300rpx;
        height: 300rpx;
      }
      .name {
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding: 0 20rpx;
        font-size: 30rpx;
        color: #333;
      }
      .price {
        display: inline-block;
        margin: 20rpx 0;
        font-size: 30rpx;
        color: #b4282d;
      }
      .sale {
        margin-left: 10rpx;
        font-size: 24rpx;
        color: #666;
      }
      &:nth-child(odd) {
        border-right: 1rpx solid #f4f4f4;
      }
    }
  }
}
